<!DOCTYPE HTML>
<html>
<div th:replace="/views/common/base-css-js::head(title=${'同城失物招领平台 招领信息页面'})"></div>

<body style="background: rgb(255, 255, 255); overflow-x: hidden;height:auto;border:1px solid white;">

<div id="pagewrapper" style="width:100%;margin:0 auto;overflow:visible;">
    <!--------------页眉开始------------------>
    <div class="container-fluid" style="width:100%;margin:0 auto;padding:0;">
        <div style="min-width:100%;max-width:1440px;margin:0 auto;">
            <!-- header start-->
            <div id="find-list-header" style="margin-top: 0px;">

                <div th:replace="/views/common/header::header"></div>
                <div th:replace="/views/common/base-css-js::head_A"></div>
                <div th:replace="/views/common/base-css-js::head_B"></div>
                <div th:replace="/views/common/header::header_A"></div>

            </div>
            <!-- header end-->

            <!-- 导航条 start -->
            <div th:replace="/views/common/navigator::navigator"></div>
            <script>
                activeNav("find-list");
            </script>
            <!-- 导航条 end -->
        </div>
    </div>
    <!--------------页眉结束------------------>

    <!-------------主体部分开始--------------->

    <div id="container" class="container-fluid" style="max-width:100%;border:1px solid red;">
        <div style="width:100%;height:30px;">
	<span style="width:38%;float:left;padding-left:10%;font-size:14px;color:black;">
		<span>现在的位置 <a href="${path}/index.html" target="_self" style="color:#666;">主页</a>-&gt; 招领信息页面</span>
	</span>
            <span style="width:38%;float:right;text-align:right;padding-right:10%;">
		<select name="type" id="types" style="width:160px;">
			<option th:value="'/find/find-list.html/1/'+${pageSize}+'/all'">--请选择物件类型--</option>
			<option th:value="'/find/find-list.html/1/'+${pageSize}+'/card'">卡类证件</option>
			<option th:value="'/find/find-list.html/1/'+${pageSize}+'/book'">书籍资料</option>
			<option th:value="'/find/find-list.html/1/'+${pageSize}+'/clo'">衣物服饰</option>
			<option th:value="'/find/find-list.html/1/'+${pageSize}+'/per_eff'">随身物件</option>
			<option th:value="'/find/find-list.html/1/'+${pageSize}+'/elec'">电子数码</option>
			<option th:value="'/find/find-list.html/1/'+${pageSize}+'/veh'">交通工具</option>
			<option th:value="'/find/find-list.html/1/'+${pageSize}+'/other'">其他宝贝</option>
		</select>
	</span>
            <script>
                //按类搜索
                $("#types").change(function () {
                    location.href = this.options[this.selectedIndex].value;
                });

                function parseValue(value) {
                    var v;
                    if (value == "card")
                        v = "卡类证件";
                    else if (value == "book")
                        v = "书籍资料";
                    else if (value == "clo")
                        v = "衣物服饰";
                    else if (value == "per_eff")
                        v = "随身物件";
                    else if (value == "elec")
                        v = "电子数码";
                    else if (value == "veh")
                        v = "交通工具";
                    else if (value == "other")
                        v = "其他宝贝";
                    else
                        v = "";

                    return v;
                }
            </script>
        </div>

        <hr style="margin-top:0">
        <div class="listthings"
             style="margin:-5px auto;*margin-top:-15px;height:auto;min-height:180px;border-bottom:1px solid #aaa;">
            <!--招领信息内容展示容器-->
            <table style="border:1px solid #aaa;" class="table table-striped table-hover">
                <!--表格形式展示-->
                <thead>
                <tr>
                    <th>物品类型</th>
                    <th>物品名称</th>
                    <th>捡到地点</th>
                    <th>发布时间</th>
                    <th>好心人的心声</th>
                    <th>详情</th>
                </tr>
                </thead>


                <tbody th:if="${pickThingsList.size() == 0}">
                <tr height="160">
                    <td colspan="6" style="color: red;text-align: center;">
                        <div style="width:200px;margin:50px auto;">暂无记录!</div>
                    </td>
                </tr>
                </tbody>


                <tbody th:if="${pickThingsList.size() > 0}">

                    <tr th:each="thing : ${pickThingsList}">
                        <td style="width:80px;">
                            <script>document.write(parseValue("[[${thing.thingsType}]]"));</script>
                        </td>
                        <td class="limit">[[${thing.thingsName}]]</td>
                        <td class="limit">[[${thing.pickPlace}]]</td>
                        <td style="width:90px;">
                            <span>[[${#dates.format(thing.publishTime,'yyyy-MM-dd')}]]</span>
                        </td>

                        <td th:if="${thing.thingsNo!=null}" class="limit">
                            尾号
                            <b style="color:red;"> [[${thing.thingsNo}]] </b>
                            的卡的失主在哪里呢
                        </td>

                        <td class="limit" th:if="${thing.thingsNo==null}">
                            <b style="color:red;"> [[${thing.thingsName}]] </b>
                            的失主在哪里呢
                        </td>

                        <td>
                            <a th:href="'/find/find-details.html/'+${thing.id}" title="失主在哪:${pickList.thingsName}">查看详情

                                <i style="display: inline; color: red; font-weight: bold;" th:if="${thing.status == 1}">成功贴</i>

                            </a>
                        </td>
                    </tr>

                </tbody>


            </table>
        </div>
        <script type="text/javascript">
            var url = location.href; //把当前页面的地址赋给变量 url
            var type = url.substring(url.lastIndexOf("/"));//取 url 最一个/分隔符的值"/type" 即当前type值 用于保存条件状态
            //alert(type);
            for (var i = 0; i < document.getElementById('types').options.length; i++) {
                var typevalue = document.getElementById('types').options[i].value;
                if (typevalue.substring(typevalue.lastIndexOf("/")) == type) {
                    document.getElementById('types').options[i].selected = true;
                    break;
                }
            }
        </script>
        <div style="width:100%;height:50px;text-align:center;margin:0 auto;padding-bottom:10px;">
            <!-- url 是提供url地址的-->
            <page:createPager totalCount="${totalCount}" pageSize="${pageSize}" totalPage="${totalPage}"
                              curPage="${pageNum}" url="${path}/find/find-list.html" valueId="types"></page:createPager>
        </div>
    </div>
    <!-------------主体部分结束--------------->

    <!----------------页脚开始---------------->
    <div class="container-fluid footer" style="max-width:100%;height:120px;">
        <div style="width:100%;margin:10px auto;text-align: center;">
            <!--页脚相关信息-->
            <div th:replace="/views/common/footer::footer"></div>
            <!--网站相关说明及信息-->
        </div>
    </div>
    <!----------------页脚结束---------------->
</div>
<!--封装容器结束-->
<script>

</script>
</body>
</html>